<template>
  <div id="bg"
       :style="{backgroundImage:'url('+bgurl+')'}" />
</template>

<script>
export default {
  props: {
    url: {
      type: String,
      default: "defaultbg.jpg"
    }
  },
  computed: {
    bgurl: function() {
      return require("@/assets/" + this.url);
    }
  }
};
</script>

<style lang="less" scoped>
#bg {
  background-size: cover;
  z-index: -1;
  object-fit: contain;
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  overflow-y: scroll;
  &::-webkit-scrollbar {
    width: 0;
  }
}
</style>